<!DOCTYPE html>
<html lang="zh">

<head>
	<meta charset="utf-8">
	<meta name="viewport"
		content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<title>我的</title>
	<link rel="stylesheet" href="css/mui.min.css" />
	<!-- build:css css/app.css -->
	<link rel="stylesheet" href="css/base.css" />
	<link rel="stylesheet" href="css/common.css" />
	<!-- endbuild -->
	<style>
		.mui-content {
			margin-bottom: 65px;
		}

		.mui-progressbar {
			background: #dddddd;
		}

		.mui-icon-arrowright {
			margin-right: 10px;
			color: #CCCCCC;
		}

		.mui-progressbar {
			margin-left: 10px;
			margin-right: 10px;
			height: 5px;
			border-radius: 0;
		}

		.header {
			height: 200px;
			text-align: center;
			background: #2D8FF3;
			overflow: hidden;
		}

		.header #logo {
			width: 75px;
			height: 75px;
			margin: 0 auto;
			margin-top: 25px;
			border-radius: 50%;
			border: 2px solid #FFFFFF;
		}

		.header img.logo {
			opacity: 0;
			width: 100%;
			height: 100%;
			border-radius: 50%;
		}

		.header .title {
			height: 22px;
			margin-top: 10px;
			color: #FFFFFF;
			font-size: 16px;
		}

		.header .navigator {
			margin-top: 12px;
		}

		.header .navigator div {
			flex: 1;
			text-align: center;
		}

		.header .navigator div button {
			width: 120px;
			height: 33px;
			color: #FFFFFF;
			border-radius: 60px;
			border-color: #FFFFFF;
			background: transparent;
		}

		.header .navigator div button:active {
			transition: all .1s ease;
			background: rgba(200, 200, 200, .2);
		}

		.function-item:first-child {
			height: 60px;
			line-height: 60px;
		}

		.function-item:first-child .title {
			margin-left: 10px;
		}

		.function-item {
			height: 45px;
			font-size: 15px;
			background: #FFFFFF;
		}

		.function-item .icon-function {
			margin-left: 15px;
			width: 23px;
			height: 23px;
		}

		.function-item .title {
			flex: auto;
			margin-left: 17.5px;
		}

		.function-item:active {
			transition: all .1s ease;
			background: rgba(200, 200, 200, .2);
		}
	</style>
</head>

<body>
	<header class="mui-bar mui-bar-nav">
		<h1 class="mui-title">我的</h1>
	</header>
	<div class="mui-content">
		<div class="header">
			<div id="logo"></div>
			<div class="title"></div>
			<div class="navigator flex-row-center">
				<div onclick="window.location.href='my-eye-resume.html'">
					<button type="button">预览简历</button>
				</div>
				<div onclick="window.location.href='my-edit-resume.html'">
					<button class="disabled" type="button">修改简历</button>
				</div>
			</div>
		</div>
		<a href="my-edit-resume.html" class="functions disabled">
			<div class="flex-row-center function-item">
				<span class="title">简历完整度</span>
				<div id="line" class="mui-progressbar">
					<span></span>
				</div>
				<span class="num">0%</span>
				<i class="mui-icon mui-icon-arrowright"></i>
			</div>
		</a>
		<div class="flex-row-center margin-top-default function-item" onclick="window.location.href='lives.html'">
			<img class="icon-function" src="img/icon_zhiweishoucang.png" alt="" />
			<span class="title">职位收藏</span>
			<i class="mui-icon mui-icon-arrowright"></i>
		</div>
		<div class="flex-row-center margin-top-default function-item" onclick="window.location.href='logs.html'">
			<img class="icon-function" src="img/icon_toudizhuangtai.png" alt="" />
			<span class="title">投递记录</span>
			<i class="mui-icon mui-icon-arrowright"></i>
		</div>
		<div class="flex-row-center margin-top-default function-item" onclick="window.location.href='help.html'">
			<img class="icon-function" src="img/icon_shiyongbangzhu.png" alt="" />
			<span class="title">使用帮助</span>
			<i class="mui-icon mui-icon-arrowright"></i>
		</div>
	</div>
	<div class="navFooter">
		<a href="index.html" id="position">
			<i class="c1"></i>首页
		</a>
		<a href="my.html" id="member" class="cur">
			<i class="c2"></i>我的
		</a>
	</div>
	<script src="js/mui.min.js" type="text/javascript"></script>
	<script src="js/zepto.min.js" type="text/javascript"></script>
	<!-- build:js js/app.js -->
	<script src="js/tools.js" type="text/javascript"></script>
	<script src="js/api.js" type="text/javascript"></script>
	<!-- endbuild -->
	<script>
		function init(res) {
			if (res['name']) {
				$('.header > .title').text(res['name']);
			}
			if (res['heardImage']) {
				var img = document.createElement('img');
				img.className = 'logo';
				img.src = res['heardImage'];
				img.style.opacity = 1;
				$('#logo').append(img);
			}
		}
		// 未登录禁用的功能
		function disabled() {
			mui('.disabled').each(function(index, element) {
				$(element).prop('disabled', true)
				if(element.nodeName.toLowerCase() == 'a') {
					element.onclick = function() {
						return false
					}
				}else {
					$('.disabled').prop('disabled', true);
				}
			})
		}
		if (isLogin()) {
			mui.ajax(config.ME_API + 'h5/h5GetResume', {
				data: {
					h5UserId: getUserId()
				},
				dataType: 'json',
				type: 'post',
				timeout: 10000,
				success: function (res) {
					if (res.code == 2) {
						res = res.data.appTdResume;
						var arr = [];
						var status = 0;
						this.init(res);
						window.localStorage.setItem('h5_rid', res.rid);
						config.resume.forEach(element => {
							if (res[element] == null || res[element] == '') {
								arr.push(element)
							} else {
								status = 100;
							}
						});
						status = parseInt(100 - arr.length * 6.66);
						mui("#line").progressbar({ progress: status }).show();
						mui('.num')[0].innerText = status + '%';
					} else {
						mui.toast(res.msg)
					}
					if (res.code == 1) {
						mui("#line").progressbar({ progress: 0 }).show();
						disabled()
						mui('.num')[0].innerText = '0%';
						mui.confirm(' 请先创建简历!', '', function (res) {
							if (res.index) {
								mui.openWindow('my-create-resume.html')
							}
						})
					}
				},
				error: function (xhr, type, errorThrown) {
					mui.toast('网络连接失败, 请稍后再试!')
				}
			});
		} else {
			disabled()
			mui.confirm('请先登录!', '', '', function (res) {
				if (res.index) {
					setTimeout(function () {
						mui.openWindow('login.html')
					}, 1000)
				}
			})
		}
	</script>
</body>

</html>